<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Register</title>
    <link rel="stylesheet" href="/css/formstyle.css">
</head>
<body>
    <div class="container">
        <div class="login-form">
            <a style="position: absolute" href="../overall/Cover.html"><img src="/img/back.svg" style="position:absolute;"></a>
            <div id="logo" class="logo" onclick="rua()"></div>
            <div id="x" class="x" onclick="x()"></div>
            <br>
            <div style="position: absolute;top: 31%;left:675px;background:#ff7979;
                        border-radius: 15px;height: 35px;width: 180px;text-align: center;">
                <a style="color: white;line-height: 35px">该用户名已被注册过</a>
            </div>
            <h3>Let's Register</h3>
            <form id="registerForm" enctype="multipart/form-data" action="/user/register" method="post">
                <div class="field">
                    <input type="file" class="" id="a_userAvatar" name="userImg" accept="image/*" style="display: none" onchange="image233(this)" >

                    <div class="username">
                        <input type="text" class="logininput" id="mobile" name="mobile" placeholder="Mobile" required>
                    </div>
                    <div class="username">
                        <input type="text" class="logininput" id="name" name="name" placeholder="UserName" required>
                    </div>
                    <div class="username">
                        <input type="text" class="logininput" id="email" name="email" placeholder="Email" required>
                    </div>
                    <div class="password">
                        <input type="password" class="logininput" id="pwd" name="pwd" placeholder="Password" required>
                    </div>
                </div>
                <button class="login-btn" type="submit">注册</button>
                <!--<div class="link">
                    <a href="#">忘记密码？</a> or <a href="#">还没有账号？请注册</a>
                </div>-->
            </form>
        </div>
    </div>

<script>
    function rua(){
        document.getElementById("a_userAvatar").click();
    }
    function image233(file){
        var img = null;
        img = window.URL.createObjectURL(file.files[0]);

        if(file.files[0].size<1048576){
            document.getElementById("logo").style.backgroundImage="url('"+img+"')";
        }
        else {
            alert("图片过大");
            document.getElementById("logo").style.backgroundImage="url('../img/default.jpg')";
            document.getElementById("a_userAvatar").value="";
        }
    }

    function x(){
        document.getElementById("logo").style.backgroundImage="url('../img/default.jpg')";
        document.getElementById("a_userAvatar").value="";
    }

</script>
</body>
</html>